import './style.css';
import './app.css';

import logo from './assets/images/logo-universal.png';
import {OpenDirectoryDialog, SeekFile} from '../wailsjs/go/main/App';

document.querySelector('#app').innerHTML = `
    <img id="logo" class="logo">
      <div class="input-box">
        <span>请选择查找的目录：</span>
        <input class="input" id="dir" type="text" autocomplete="off" />
        <button class="btn" onclick="openDirectoryDialog()">选择目录</button>
      </div><br>
      <div class="input-box" id="input">
        <span>请输入查找的文件：</span>
        <input class="input" id="name" type="text" autocomplete="off" />
        <button class="btn" onclick="seekFile()">查找</button>
      </div>
      <textarea class="result" id="result" rows="14" cols="140" readonly>请选择目录并输入要查找的文件👆</textarea>
    </img>
`;
document.getElementById('logo').src = logo;

let dirElement = document.getElementById("dir");
let nameElement = document.getElementById("name");
nameElement.focus();
let resultElement = document.getElementById("result");

window.openDirectoryDialog = function () {
    try {
        OpenDirectoryDialog()
            .then((result) => {
                dirElement.value = result;
            })
            .catch((err) => {
                console.error(err);
            });
    } catch (err) {
        console.error(err);
    }
}

window.seekFile = function () {
    if (dirElement.value === "") {
        resultElement.innerText = "请选择目录";
        return;
    }
    if (nameElement.value === "") {
        resultElement.innerText = "请输入文件名";
        return;
    }
    try {
        SeekFile(dirElement.value, nameElement.value)
            .then((result) => {
                resultElement.innerText = result;
            })
            .catch((err) => {
                console.error(err);
            });
    } catch (err) {
        console.error(err);
    }
}
